Security News
The Push to Ban Ransom Payments Is Gaining Momentum
Ransomware costs victims an estimated $30 billion per year and has gotten so out of control that global support for banning payments is gaining momentum.
@fortawesome/free-solid-svg-icons
Advanced tools
Package description
The @fortawesome/free-solid-svg-icons package provides scalable vector icons that can instantly be customized — size, color, drop shadow, and anything that can be done with the power of CSS. It is part of the Font Awesome icon library.
Adding icons to a web project
This code sample demonstrates how to import an icon (in this case, the coffee icon) from the package and use it in a React component with the help of the FontAwesomeIcon component.
import { faCoffee } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
<FontAwesomeIcon icon={faCoffee} />
Customizing icon size
This code sample shows how to customize the size of an icon using the 'size' prop, which accepts values like 'xs', 'lg', '6x', etc.
import { faSpinner } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
<FontAwesomeIcon icon={faSpinner} size='3x' />
Animating icons
This code sample illustrates how to apply an animation to an icon, such as a spinning effect, by using the 'spin' prop.
import { faSpinner } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
<FontAwesomeIcon icon={faSpinner} spin />
Layering and grouping icons
This code sample demonstrates how to layer multiple icons on top of each other and apply transformations such as shrinking to create a composite icon.
import { faCircle, faCheck } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon, FontAwesomeLayers } from '@fortawesome/react-fontawesome';
<FontAwesomeLayers>
<FontAwesomeIcon icon={faCircle} />
<FontAwesomeIcon icon={faCheck} transform='shrink-6' />
</FontAwesomeLayers>
Material Icons are a set of icons designed under the material design guidelines. They offer a different aesthetic compared to Font Awesome and are available as an npm package. They are typically used in projects that follow Material Design principles.
Ionicons is an open-sourced and MIT licensed icon pack created by the Ionic Framework team. It provides a large collection of icons for use in web, iOS, Android, and desktop apps. Ionicons have a different design style and are often used in conjunction with Ionic projects.
Typicons are free-to-use vector icons embedded in a webfont for easy use in your user interfaces, whether it be on the web or in a native application. The package contains a set of hand-crafted icons that are simple and expressive.
Readme
"I came here to chew bubblegum and install Font Awesome 6 - and I'm all out of bubblegum"
$ npm i --save @fortawesome/free-solid-svg-icons
Or
$ yarn add @fortawesome/free-solid-svg-icons
Get started here. Continue your journey here.
Or go straight to the API documentation.
Start with GitHub issues and ping us on Twitter if you need to.
FAQs
The iconic font, CSS, and SVG framework
We found that @fortawesome/free-solid-svg-icons demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 7 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Ransomware costs victims an estimated $30 billion per year and has gotten so out of control that global support for banning payments is gaining momentum.
Application Security
New SEC disclosure rules aim to enforce timely cyber incident reporting, but fear of job loss and inadequate resources lead to significant underreporting.
Security News
The Python Software Foundation has secured a 5-year sponsorship from Fastly that supports PSF's activities and events, most notably the security and reliability of the Python Package Index (PyPI).